<!DOCTYPE html>
<html>
<head>
	<title> New Document </title>


	<style type="text/css" media="screen">
		ul.demo {display:block; width: 30%; height:120px; padding:0; margin:0; background:#9cc; list-style-type:none;}
		ul.demo li {background:#fcc; display:block; width:25%; height:50px; padding:0; margin:0; float: left; position:relative; overflow:hidden; cursor:default;  font-size:0.9em; line-height:1.1em;}
		ul.demo li.p2 {background:#ffc;}
		ul.demo li.p3 {background:#cfc;}
		ul.demo li.p4 {background:#ccf;}
		ul.demo li span { display:block; margin:4px; background:#eef; cursor:default;}
	</style>
	
	<script type="text/javascript" src=jquery1.js></script>
	<script typescript type="text/javascript" src="dropdown.js"></script>
	<script type="text/javascript" charset="utf-8">
		jQuery(function($){
			$("#demo1 li").dropdown({event_height:200});
		}); 

	</script>
</head>

<body>
	<ul class="demo" id="demo1">
			<li class="p1" style="height: 75px; width : 100px"> </li>
			<li class="p2" style="height: 75px; width : 100px"> </li>
			<li class="p3" style="height: 75px; width : 100px"> </li>
			<li class="p4" style="height: 75px; width : 100px"><span>test set by gihoon</span></li>
	</ul>

</body>
</html>
